<template>
  <orh-table add="add" pages @on-add="displays" :pageDate="pageDate" @on-page-change="queryData" del="del" @on-del="confirm">
        <Table :columns="columns1" :data="tealeaveList" slot="table" @on-selection-change="selectOne" :loading="tableload"  highlight-row ref="currentRowTable"></Table>
        <orh-sidebar v-model="show" :title="layouttitle" scale slot="others">
            <component :is="content" :infoId='infoId' @requery="requery"></component>
        </orh-sidebar>
    </orh-table>
</template>

<script>
import OrganizationLeaveSee from './OrganizationLeaveSee.vue';
export default {
    components: {
        Operation: resolve => {require(['./Operation.vue'], resolve);},
        OrganizationLeaveSee
    },
    name: 'leave-organizationleave',
        data(){
            return {
                content:null,
                del:[],
                pageDate: {
                    total: 0,
                    current_page: 1,
                    per_page: 1
                },
                show: false,
                layouttitle:null,
                tealeaveList:[],
                infoId: null,
                tableload:true,
                listurl:'api/leave/v1/organization_leave/index?page=',
                delUrl:'api/leave/v1/organization_leave/delete/',
                columns1: [
                    {
                        type: 'expand',
                        width: 50,
                        align: 'center',
                        render: (h, params) => {
                            return h(OrganizationLeaveSee, {
                                props: {
                                    row: params.row
                                }
                            })
                        }
                    },
                   {
                        type: 'selection',
                        width: 60,
                        align: 'center',
                    },
                    {
                        title: '学期',
                        align: 'center',
                        render: (h, params) => {
                            return h('div', params.row.semester.semester_name.zh);
                        }
                    },
                    {
                        title: '年级',
                        align: 'center',
                        render: (h, params) => {
                            return h('div', params.row.grade!=null ? params.row.grade.grade.grade_name.zh : '');
                        }
                    },
                    {
                        title: '请假标题',
                        align: 'center',
                        render: (h, params) => {
                            return h('div', params.row.title!=null ? params.row.title.zh : '' );
                        }
                    },
                    {
                        title: '请假开始时间',
                        align: 'center',
                        key:'start_time',
                    },
                    {
                        title: '请假结束时间',
                        align: 'center',
                        key:'end_time',
                    },
                    {
                        title: '请假内容',
                        align: 'center',
                        render: (h, params) => {
                            return h('div', params.row.content!=null ? params.row.content.zh : '');
                        }
                    },
                    {
                        title: '操作',
                        key: 'action',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    directives: [
                                        {
                                            name: 'button',
                                            value: 'edit',
                                        }
                                    ],
                                    props: {
                                        type: 'primary',
                                        size: 'small',
                                    },
                                    style: {
                                        marginRight: '5px',
                                    },
                                    on: {
                                        click: () => {
                                            this.update(params.row.organization_leave_id)
                                        }
                                    }
                                }, '编辑'),
                                h('Button', {
                                    directives: [
                                        {
                                            name: "button",
                                            value: "del"
                                        }
                                    ],
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px',
                                    },
                                    on: {
                                        click: () => {
                                            this.del = [params.row.organization_leave_id]
                                            this.confirm()
                                        }
                                    }
                                }, '删除'),
                            ]);
                        },
                    }
                ],
            }
        },

        methods: {
            /************************************************************
             * 获取班级集体请假的数据
             ************************************************************/
            queryData(index){
                this.tableload = true
                this.$http.get(`${this.listurl}${index}`).then(val=>{
                    this.tealeaveList = val.data.data
                    if(val.pages!=null){
                        this.pageDate.total=val.data.total
                        this.pageDate.per_page=val.data.per_page
                        this.pageDate.current_page=val.data.current_page
                    }
                    this.tableload = false
                }).catch(err => {
                    if (err.code && err.code == 422) {
                        this.$Message.error(err.message);
                    }
                    this.tableload = false
                })
            },
            /************************************************************
             * 添加
             ************************************************************/
            displays(){
                this.show = true
			    this.content = 'Operation'
                this.layouttitle='申请'
                this.infoId = null
            },
            /************************************************************
             * 编辑
             ************************************************************/
            update(index){
                this.infoId = index
                this.show = true
			    this.content = 'Operation'
                this.layouttitle='修改'
            },
            /************************************************************
             * 批量删除
             ************************************************************/
            selectOne(index){
                this.del = index.map(item=>item.organization_leave_id)
            },
            /************************************************************
             * 执行删除操作
             ************************************************************/
            confirm () {
                this.$Modal.confirm({
                    title: '数据删除',
                    content: '<p>您确定要删除这些数据吗?</p>',
                    onOk: () => {
                        if(this.del.length==0){
                            this.$Message.error('请选择删除项');
                            return
                        }
                        this.del = JSON.stringify(this.del)
                        this.tableload = true
                        this.$http.delete(`${this.delUrl}${this.del}`).then(val=>{
                            this.del=[]
                            this.queryData(this.pageDate.current_page)
                            this.$Message.success(val.message);
                        }).catch(err=>{
                            if(err.code && err.code==422) {
                                this.$Message.error(err.message);
                            }
                            this.del=[]
                            this.tableload = false
                        })
                    },
                });
            },
            /************************************************************
             * 数据更新
             ************************************************************/
            requery(val){
                if(val == true){
                    this.show = false
                    this.queryData(this.pageDate.current_page);
                }
            },
        },
        mounted(){
            this.queryData(this.pageDate.current_page);
        },
}
</script>

